<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

<style>
/* 全局 tooltip 样式美化 */
.el-tooltip__popper {
  max-width: 500px !important;
  line-height: 1.8 !important;
  padding: 15px 20px !important;
  background: #f8f9fa !important;
  color: #333 !important;
  border-radius: 6px !important;
  border: none !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1) !important;
  font-size: 14px !important;
  word-break: break-all !important;
  white-space: pre-wrap !important;
}

/* 调整 tooltip 箭头样式 */
.el-tooltip__popper[x-placement^="top"] .popper__arrow {
  border-top-color: #f8f9fa !important;
}

.el-tooltip__popper[x-placement^="top"] .popper__arrow::after {
  border-top-color: #f8f9fa !important;
}

.el-tooltip__popper[x-placement^="bottom"] .popper__arrow {
  border-bottom-color: #f8f9fa !important;
}

.el-tooltip__popper[x-placement^="bottom"] .popper__arrow::after {
  border-bottom-color: #f8f9fa !important;
}

/* 表格单元格内容样式 */
.el-table .cell {
  line-height: 1.5;
  padding: 8px 12px;
}

/* 表格鼠标悬停效果 */
.el-table tbody tr:hover > td {
  background-color: #f5f7fa;
}

/* 文字溢出时显示省略号 */
.el-table .cell {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>
